<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>配置管理</title>

    <!-- 引入网站图标 -->
    <link rel="icon" href="{{ url_for('static', filename='image/logo.png') }}" type="image/png">

    <!-- Bootstrap 5 -->

    <link rel="stylesheet" href="{{ url_for('static', filename='css/bootstrap.min.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/toastr.min.css') }}">
    <link rel="stylesheet" href="{{ url_for('static', filename='css/index.css') }}">

</head>

<body class="bg-light">
<div class="container py-5">
    <h1 class="mb-4">配置管理</h1>

    <!-- 配置表单 -->
    <form id="configForm">
        <fieldset class="mb-3 border p-3 api-text">
            <fieldset class="mb-3 border p-3 api-text">
                <legend>豆包模型</legend>

                <div class="col-md-6 mb-3 ">
                    <label class="form-label">网址</label>
                    <input type="text" class="form-control" name="db_base_url" disabled="false"
                    >
                </div>

                <div class="col-md-6 mb-3 ">
                    <label class="form-label">密匙</label>
                    <input type="text" class="form-control" name="db_api_key" disabled="false"
                    >
                </div>

            </fieldset>

            <fieldset class="mb-3 border p-3 api-text">
                <legend>微软TTS</legend>

                <div class="mb-3">
                    <label class="form-label">密匙</label>
                    <input type="text" class="form-control" name="azure_ttsapi_key" disabled="false"
                    >
                </div>

                <div class="row">
                    <div class="col-md-6 mb-3">
                        <label class="form-label">服务器位置</label>
                        <input type="text" class="form-control" name="azure_region" disabled="false"
                        >
                    </div>
                    <div class="col-md-6 mb-3">
                        <label class="form-label">音色名</label>
                        <input type="text" class="form-control" name="azure_voice_name" disabled="false"
                        >
                    </div>
                </div>

            </fieldset>

            <div class="mb-3">
                <label class="form-label">初始提示词</label>
                <textarea class="form-control" name="init_prompt"
                          rows="3" disabled="false"> </textarea>


            </div>

            <div class="d-grid gap-2 d-md-flex justify-content-md-end">
                <button type="button" class="btn btn-primary me-md-2" onclick="initEditable()">默认参数</button>
                <button type="button" id="sevaEditButton"  class="btn btn-success"    onclick="toggleEditable()">编辑参数</button>

            </div>
        </fieldset>

        <div class="container" id="prompt_list">
            <div class="row">
                 <div class="col-md-6 mb-3">
                    <label class="form-label"  >数量</label>
                    <!-- 添加选择列表 -->
                    <select   id="quantitySelect" onchange="printSelectedNumber()">
                        {% for i in range(1, 101) %}
                            <option value="{{ i }}">{{ i }}</option>
                        {% endfor %}
                    </select>

                </div>

                <div class="col-md-4  mb-3 ">
                    <label class="form-label  ">起手式</label>
                    <input type="text" name="start_prompt"   style="width: 200px;  ">
                </div>
                <!-- 添加开关 -->
                <div class="form-check form-switch  col-md-2 ">
                    <input class="form-check-input col-md-5 " type="checkbox" id="startPromptSwitch">
                    <label class="form-check-label col-md-5 " for="startPromptSwitch">启用</label>
                </div>

            </div>




            <!-- 用于动态添加额外文本框的容器 -->
            <div id="textarea-container">

            </div>
        </div>

        <div class="d-grid gap-2 d-md-flex justify-content-md-end">
            <button type="button" class="btn btn-primary me-md-2" onclick="createSceneScript()">生成脚本</button>
            <button type="button" id="runButton" class="btn btn-success" onclick="runProcess()">执行处理</button>
        </div>
    </form>
</div>

<!-- Scripts -->
<script src="{{ url_for('static', filename='js/jquery-3.6.0.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/bootstrap.bundle.min.js') }}"></script>
<script src="{{ url_for('static', filename='js/toastr.min.js') }}"></script>


<script src="{{ url_for('static', filename='js/index.js') }}"></script>
<script src="{{ url_for('static', filename='js/tools.js') }}"></script>
</body>

</html>